Navigation Bar
Type
widget
Summary
The navigation bar widget is intended for use in mobile apps for switching between cards, although there are many other possible uses.
The widget displays a row of navigation items. Each of these has a name, which identifies it. Depending on the selected itemStyle, the items may display a label, icon, or both. All of the navigation item data is available as a single array via the itemArray property.
At any time, zero or one of the navigation items may be highlighted. This is useful, for example, for indicating the current card. When the user clicks one of the navigation items, the widget sends a hiliteChanged message.
Description
The navigation bar widget is intended for use in mobile apps for switching between cards, although there are many other possible uses.
The widget displays a row of navigation items. Each of these has a name, which identifies it. Depending on the selected itemStyle, the items may display a label, icon, or both. All of the navigation item data is available as a single array via the itemArray property.
At any time, zero or one of the navigation items may be highlighted. This is useful, for example, for indicating the current card. When the user clicks one of the navigation items, the widget sends a hiliteChanged message.
Related
message: hiliteChanged
property: hilitedItemName, itemArray, itemIcons, itemLabels, itemNames, itemStyle
Children Properties
Message
| Name | Summary | Syntax |
|---|---|---|
| hiliteChanged | Sent when a navigation item is selected | hiliteChanged |
Property
| Name | Summary | Syntax |
|---|---|---|
| hiliteColor | The color of the highlighted navigation item | get the hiliteColor of <widget> set the hiliteColor of <widget> to <color> |
| foreColor | The color of the navigation items that are not highlighted | get the foreColor of <widget> set the foreColor of <widget> to <color> |
| backColor | The color of the navigation bar background | get the backColor of <widget> set the backColor of <widget> to <color> |
| borderColor | The color of the navigation bar border | get the borderColor of <widget> set the borderColor of <widget> to <color> |
| showBorder | Whether there is a dividing line at the top of the widget | get the showBorder of <widget> set the showBorder of <widget> to {true | false} |
| hilitedItemName | The name of the highlighted navigation item | get the hilitedItemName of <widget> set the hilitedItemName of <widget> to <pName> |
| opaque | Whether the background of the widget is filled | get the opaque of <widget> set the opaque of <widget> to {true | false} |
| itemIcons | The normal-state icons for the navigation items | get the itemIcons of <widget> set the itemIcons of <widget> to <icons> |
| itemStyle | The style with which navigation items are displayed | get the itemStyle of <widget> set the itemStyle of <widget> to <style> |
| hilitedItemIcons | The highlighted-state icons for the navigation icons | get the hilitedItemIcons of <widget> set the hilitedItemIcons of <widget> to <icons> |
| itemNames | The names of the navigation items | get the itemNames of <widget> set the itemNames of <widget> to <names> |
| desiredHeight | The optimal height for the widget | get the desiredHeight of <widget> |
| hilitedItem | The index of the highlighted navigation item | get the hilitedItem of <widget> set the hilitedItem of <widget> to <itemNumber> |
| editMode | Whether the widget is in edit mode | get the editMode of <widget> set the editMode of <widget> to {true | false} |
| itemArray | The full navigation item data. | get the itemArray of <widget> set the itemArray of <widget> to <array> |
| itemLabels | The labels of the navigation items | get the itemLabels of <widget> set the itemLabels of <widget> to <labels> |